<%@ page contentType="text/html; charset=UTF-8"%>
<%@ taglib uri="/struts-tags" prefix="s"%>
<html>
	<head>
		<title>封条管理及验证系统--商品查看</title>
		<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
		<LINK href="<%=request.getContextPath()%>/css/product.css"
			type="text/css" rel="stylesheet" />
		<%@ include file="/comm.jsp"%>
		<script language="JavaScript"
			src="<%=request.getContextPath()%>/js/productImage.js"></script>
<script language="javascript">
window.onload=function(){
	var color = new Select("color",{
		Radio :true	,	//是否为单选,默认为true,如果设置为true,Default,Max选项将失效
		OnClick:function(selected){
			document.form.selColor.value = selected.join(",");
		}
	});
}

function Order(){
	var orderNum=$d("orderNum").value;
	var productId=$d("product.id").value;
	var status=$d("product.status").value;
	if(status != '1'){
		alert('该商品未发布,不能购买'+status);
		return;
	}
	document.form.action="order_createOrderPage.do";
	document.form.submit();
}

</script>
<style>
<!--
body,td,th {
	font-size: 12px;
}
a:link {
	color: #000000;
}
a:visited {
	color: #000000;
}
a:hover {
	color: #000000;
}

ul{list-style-type:none;}
ul li{float:left;display:inline;margin-right:5px;width:auto;overflow:hidden;}
ul li a{display:block;border:1px solid #CCCCCC;padding:5px 6px 5px 6px;margin:1px;}
ul li a:hover{border:2px solid #FF6701;margin:0px;}
.select{}
.select a{border:2px solid #FF6701;margin:0px;background:url(../images/bg-55.gif) no-repeat no-repeat right bottom;}

-->
</style>
	<body leftmargin="0" topmargin="0" marginheight="0">
		<s:form id="form" name="form" action="product_issue" namespace="/">
			<s:token>
			</s:token>
			<s:hidden id="hdfId" name="product.id" value="%{#request.product.id}" />
			<s:hidden id="hdfStatus" name="product.status" value="%{#request.product.status}" />
			<s:hidden id="hdfColor" name="selColor" value=""/>
			<div align="center">
				<%@ include file="/messages.jsp"%>
				<s:if test="#request.product==null">
					商品不存在或已下架
				</s:if>
				<s:else>
				<table align="center" width="750">
					<tr>
						<td>
							<DIV id=focus_img>
								<TABLE id=focus_warp cellSpacing=0 cellPadding=0 width=325
									border=0>
									<TBODY>
										<TR>
											<TD>
												<DIV id=au style="WIDTH: 325px">
													<DIV class=dis name="f">
														<IMG height=225 alt="商品图片" src="<%=request.getContextPath()%>/upload/seal/${product.image1}"
															width=325>
													</DIV>
													<DIV class=undis name="f">
														<IMG height=225 alt="商品图片" src="<%=request.getContextPath()%>/upload/seal/${product.image2}"
															width=325>
													</DIV>
													<DIV class=undis name="f">
														<IMG height=225 alt="商品图片" src="<%=request.getContextPath()%>/upload/seal/${product.image3}"
															width=325>
													</DIV>
													<DIV class=undis name="f">
														<IMG height=225 alt="商品图片" src="<%=request.getContextPath()%>/upload/seal/${product.image4}"
															width=325>
													</DIV>
												</DIV>
											</TD>
										</TR>
										<TR>
											<TD height=75>
												<TABLE id=simg cellSpacing=0 cellPadding=0 width=326
													border=0>
													<TBODY>
														<TR>
															<TD class=s onmouseover="play(this,'au','');" align=right>
																<IMG height=56 width=77 src="<%=request.getContextPath()%>/upload/seal/s_${product.image1}" />
															</TD>
															<TD class=s onmouseover="play(this,'au','');" align=right>
																<IMG height=56 width=77 src="<%=request.getContextPath()%>/upload/seal/s_${product.image2}" />
															</TD>
															<TD class=s onmouseover="play(this,'au','');" align=right>
																<IMG height=56 width=77 src="<%=request.getContextPath()%>/upload/seal/s_${product.image3}" />
															</TD>
															<TD class=s onmouseover="play(this,'au','');" align=right>
																<IMG height=56 width=77 src="<%=request.getContextPath()%>/upload/seal/s_${product.image4}" />
															</TD>
														</TR>
													</TBODY>
												</TABLE>
											</TD>
										</TR>
									</TBODY>
								</TABLE>
							</DIV>
						</td>
						<td valign="top">
							<TABLE cellSpacing="1" cellPadding="1" width="325">
								<TBODY>
									<tr>
										<td colspan="2">
											${product.productName }
										</td>
									</tr>
									<tr>
										<td>
											价格：
										</td>
										<td>
											${product.price }
											<s:if test='"RMB"==#request.product.currtype'>
												元
											</s:if>
											<s:elseif test='"USD"==#request.product.currtype'>
												美元
											</s:elseif>
										</td>
									</tr>

									<tr>
										<td>
											颜色：
										</td>
										<td align="left">
											<ul id="color">
											<s:iterator value="#request.colors">
												<li dataValue=<s:property/>><a href="#"><s:property/></a></li>
											</s:iterator>
											</ul>
										</td>
									</tr>
									
									<tr>
										<td>
											型号：
										</td>
										<td>
											${product.type }
										</td>
									</tr>
									

									<tr>
										<td>
											我要买：
										</td>
										<td>
											<input name="orderNum" type="text" maxlength="6" size="4"
												value="100" />
											(起订数量：${product.minOrderNum }件)
										</td>
									</tr>
									<tr>
										<td align="center" colspan="2">
											<a href="#" onclick="Order()"> <img
													src="<%=request.getContextPath()%>/images/icon_buy.gif" border="0" /> </a>
										</td>
									</tr>
								</TBODY>
							</TABLE>
						</td>
					</tr>
					<tr>
						<td colspan="2">
							${product.detail }
						</td>
					</tr>

					<tr>
						<td colspan="2" align="center">
							<br />
							<br />
							<s:if test="0==product.status">
								<input type="submit" class="button" id="ok" name="ok"
									value=" 商品上架 " />
								&nbsp;&nbsp;
								<input type="button" class="button" id="resets" value=" 返 回 "
								onclick="return backHome(this.form,'product_list.html');" />
							</s:if>
						</td>
					</tr>
				</table>
				</s:else>
			</div>
		</s:form>
<script language="javascript" type="text/javascript">
function Select(id,config){
	this.config = config||{};
	this.id = typeof(id)=='string'?document.getElementById(id):id;
	this.items = this.id.getElementsByTagName("li");
	this.selectClass = "select";
	this.selected = new Array();
	var _this = this;
	this.selectOpt = function(value,opt){
		var exist = false;
		for(var i=0;i<_this.selected.length;i++){
			if(_this.selected[i]==value){
				exist = true ;
				if(opt=="remove"){ _this.selected.splice(i,1);}
				break;
			}
		}
		if(!exist && opt=="add"){_this.selected.push(value);}
	};
	//初始化对象
	(function(_this){
		//是否有默认配置的选择项
		if(_this.config.Default){
			var arr = _this.config.Default.split(",");
			for(var i=0;i<arr.length;i++)_this.selectOpt(arr[i],"add");
		}
		for(var i=0;i<_this.items.length;i++){
			//将defalut中配置的项加上样式
			if( _this.selected.join(",").indexOf(_this.items[i].getAttribute('dataValue'))>-1 && _this.items[i].className==""){
				_this.items[i].className=_this.selectClass;
			}
			//如果有样式中定义了默认
			if(_this.items[i].className==_this.selectClass){
				_this.selectOpt(_this.items[i].getAttribute('dataValue'),"add");
			}
			//加点单击事件
			_this.items[i].onclick=function(){
				//是否为单选
				var radio = _this.config.Raido?_this.config.Raido:true;
				if(_this.config.Radio==null || _this.config.Radio){
					if(this.className!=_this.selectClass){
						var items = this.parentNode.getElementsByTagName("li");
						for(var i=0;i<items.length;i++){
							items[i].className="";
						}
						_this.selected.length = 0;
						_this.selected.push(this.getAttribute('dataValue'));
						this.className=_this.selectClass;
					}
				}else{
					var Max = _this.config.Max?_this.config.Max:1;
					if(this.className==_this.selectClass){
						this.className="";
						_this.selectOpt(this.getAttribute('dataValue'),"remove");
					}else{
						if(_this.selected.length>=Max){
							alert("最多只能选择"+Max+"项");
						}else{
							this.className=_this.selectClass;
							_this.selectOpt(this.getAttribute('dataValue'),"add");
						}
					}
				}
				//去掉那个虚线框
				this.firstChild.blur();
				//调用回调函数
				if(_this.config.OnClick)_this.config.OnClick.call(this,_this.selected);
				return false;
			}
		}
	})(_this);	
}


</script>
	</body>
</html>